﻿@model List<RH.Web.ViewModels.ProductViewModel>
@using RH.Web.ViewModels;
@using RH.Web.Utility;
@using RH.Common.Extensions;

@{
    ViewBag.Title = Html.GetPageTitle("Product Compare");
    RH.Web.ViewModels.ProductViewModel _FirstProduct = null;
    if (Model != null && Model.Count > 0){
        _FirstProduct = Model[0];
    }    
    List<int> _ProductInWishList = ViewBag.ProductInWishList as List<int>;    
}
@if (Model == null || Model.Count == 0)
{
    @Html.ErrorMessageBox("Sorry! requested products were not found for comparison.")
}
else
{
    ///Assuming all Products are in Same Product Category
    ZGLModel categoryZGL = Model[0].CategoryZGL;
    <div class="comparison-container GroupBox">
        <ul class="feature-list">
            <li class="line-item" style="border-bottom:none;">
                <span class="line-item-name"><span class="line-item-text">&nbsp;</span></span>   
                <ul class="line-item-value-list">                
                @for (int i = 0; i < Model.Count; i++)
                {
                    RH.Web.ViewModels.ProductViewModel product = Model[i];   
                    <li class="line-item-value">                 
                    @if (product.ProductImages != null && product.ProductImages.Count > 0)
                    {
                        <img class="product-image" src="@ImageManager.GetProductImageUrl(product.ProductImages[0].Thumbnail, product.ID)" alt="@product.Name" title="@product.Name" />
                    }            
                    @Html.ProductDetailsLink(product.ID, product.ProductUrl, product.Name)                    
                    </li>
                }
                </ul>
                <span class="clear-span"></span>
            </li>
        </ul>
        
        @*Price Row*@
        <div class="PropertyGroupTitle">
            <div class="float-left">Price</div>
            <div class="float-right"><div class="toggle-up" onclick="ShowHideSpec(this, 'ulPrice');"></div></div>
            <div class="clear"></div>
        </div>
        <ul id="ulPrice" class="feature-list">            
            <li class="line-item">
                <span class="line-item-name"><span class="line-item-text">&nbsp;</span></span>
                <ul class="line-item-value-list">
                @for (int i = 0; i < Model.Count; i++)
                {
                    RH.Web.ViewModels.ProductViewModel product = Model[i];
                    <li class="line-item-value price-block">
                        <div class="price-amount">@Html.FormatData(product.Price) <span>@ConfigReader.CurrencyCode</span></div>
                        
                        @if (_ProductInWishList.Contains(product.ID))
                        {
                            @*<div style="clear:both;">Added To Wish List</div>*@
                            <div style="clear:both;">
                                @*<input id="btnRemove@(i)" type="button" 
                                    value="Added To Wish List" 
                                    onclick="AddRemoveWishList('@product.ID','btnRemove@(i)',this.value);" />*@
                                
                                <img id="img@(i)"
                                src="/Content/Images/RemoveFromCart2.png" 
                                height="20px" width="20px" 
                                title="Remove From Favorite" 
                                onclick="AddRemoveFavorite('@product.ID','img@(i)',this.title);"
                                onmouseover="this.style.cursor='pointer'" 
                                alt="Add To Favorite" />
                            </div>
                        }
                        else
                        {
                            @*<div style="clear:both;">@Html.PrivateLink("Add to Wish list", "Add/" + product.ID, "wishlist")</div>*@
                            <div style="clear:both;">
                                @*<input id="btnAdd@(i)" 
                                    type="button" 
                                    value="Add To Wish List" 
                                    onclick="AddRemoveWishList('@product.ID','btnAdd@(i)',this.value);" />*@
                            
                                <img id="img@(i)"
                                src="/Content/Images/AddToCart2.png" 
                                height="20px" width="20px" 
                                title="Add To Favorite" 
                                onclick="AddRemoveFavorite('@product.ID','img@(i)',this.title);"
                                onmouseover="this.style.cursor='pointer'" 
                                alt="Add To Favorite" />
                                
                            </div>
                        }
                    </li>
                }                
                </ul>
                <span class="clear-span"></span>
            </li>
        </ul>
        
        @*Dynamic Properties
        Specification Section Starts Here*@        
        @if (categoryZGL != null)
        {
            int spectCount = 0;
            foreach (ZGLModelGroup group in categoryZGL.Group)
            {              
            @*<div class="PropertyGroup">*@
                <div class="PropertyGroupTitle">
                    @if (!group.Icon.IsNullOrEmpty())
                    {
                        <div class="float-left">
                            <img class="ItemGroupIcon" src="@(AppConstants.Directories.PRODUCT_PROPERTY_GROUP_ICONS + "/" + group.Icon)" alt="" title="@group.Name" />
                        </div>
                    }
                    <div class="float-left ItemGroupTitle">@group.Name</div>
                    <div class="float-right"><div class="toggle-up" onclick="ShowHideSpec(this, 'ulSpec_@(spectCount)');"></div></div>
                    <div class="clear"></div>
                </div>

                <ul id="ulSpec_@(spectCount)" class="feature-list">                  
                @foreach (ZGLModelGroupProperty property in group.Property)
                {
                    <li class="line-item">                    
                        <span class="line-item-name"><span class="line-item-text">@property.Label</span></span>
                        <ul class="line-item-value-list">
                            @foreach (RH.Web.ViewModels.ProductViewModel product in Model)
                            {
                            <li class="line-item-value">@WebUtil.GetPropertyValue(group.Name, property.Name, product.CategoryZGL)</li>
                            }
                        </ul>
                        <span class="clear-span"></span>                             
                    </li>
                }                    
                </ul>                
                spectCount = spectCount + 1;
            }
        }        
    </div>
    
    <script language="javascript" type="text/javascript">
        function ShowHideSpec(div, elementId) {
            var element = $('#' + elementId);
            if ($(element).is(':visible')) {
                $(element).slideUp('slow');
                $(div).removeClass('toggle-up').addClass('toggle-down');
            }
            else {
                $(element).slideDown('slow');
                $(div).removeClass('toggle-down').addClass('toggle-up');
            }
        }


//        function AddRemoveWishList(productId, btnId, btnText) {
//            //alert(test);
//            if (btnText == 'Add To Wish List') {
//                $.ajax({
//                    type: 'POST',
//                    url: '@Url.Action("AddRemoveWishList", "Product", new { area = AppConstants.Area.PUBLIC })',
//                    data: 'ID=' + productId,
//                    success: function (isAdded) {
//                        if (isAdded) {
//                            if (btnText == 'Add') {
//                                $('#' + btnId + '').val('Added To Wish List');
//                                alert("Product add to your wish list.");
//                            }
//                            else {
//                                $('#' + btnId + '').val('Add');
//                                alert("Product removed from your wish list.");
//                            }

//                            //                    $(anchorElement).parent().remove();
//                            //                    window.location.reload();
//                        }
//                        else
//                            alert("Sorry! You are not logged in.");
//                    },
//                    error: function (e) {
//                        alert(e);
//                    }
//                });
//            }
//        }

        function AddRemoveFavorite(productId, btnId, btnText) {
            //if (btnText == 'Add') {
            //alert(productId);
            var url = '@Url.Action("AddRemoveWishList", "Product", new { area = AppConstants.Area.PUBLIC })';
            Ajax(url, 'ID=' + productId, function (isAdded) {
                if (isAdded) {
                    if (btnText == 'Add To Favorite') {
                        $('#' + btnId + '').attr('title', 'Remove From Favorite');
                        $('#' + btnId + '').attr('src', '../../Content/Images/RemoveFromCart2.png');
                        $('#' + btnId + '').attr('alt', 'Remove From Favorite');
                        alert("Product add to your favorite list.");
                    }
                    else {
                        $('#' + btnId + '').attr('title', 'Add To Favorite');
                        $('#' + btnId + '').attr('src', '../../Content/Images/AddToCart2.png');
                        $('#' + btnId + '').attr('alt', 'Add To Favorite');
                        alert("Product removed from your favorite list.");
                    }
                }
                else {
                    window.location = "/Account/LogOn?ProductID=" + productId + "&ReqFrom=AddFavorite";
                    //'<%Session["FvtProductID"] = "' + productId + '"; %>';
                }
            });
            //}
        }

    </script>
} 
